<template>
    <div>
        <!-- 面包屑 -->
        <el-breadcrumb :separator-icon="ArrowRight">
            <el-breadcrumb-item :to="{ path: 'home' }">过程任务</el-breadcrumb-item>
            <el-breadcrumb-item>任务详情</el-breadcrumb-item>
        </el-breadcrumb>

        <h2 style="border-bottom: 1px solid;padding-bottom: 10px;">任务详情</h2>

        <div style="margin: 3% 5% 3% 5%;">
            <!-- 选题详情 -->
            <div>
                <el-descriptions title="选题详情" column="2" size="large">
                    <el-descriptions-item label="任务名称" width="200px">{{ taskDetial.taskName }}</el-descriptions-item>
                    <el-descriptions-item label="任务类型">{{ taskDetial.taskType }}</el-descriptions-item>
                    <el-descriptions-item label="开始时间">{{ taskDetial.startDate }}</el-descriptions-item>
                    <el-descriptions-item label="截止时间">{{ taskDetial.endDate }}</el-descriptions-item>
                </el-descriptions>
            </div>

            <h1>班级详情</h1>
            <div style="margin-top:2%;"><!-- 收到的小队邀请 -->
                <el-table :data="processTask" height="550" border stripe style="width: 100%; height:200px;">
                    <el-table-column prop="stuName" label="学生姓名" />
                    <el-table-column prop="stuId" label="学号" />
                    <el-table-column prop="className" label="班级" />
                    <el-table-column prop="subDate" label="提交时间" />
                    <el-table-column fixed="right" label="报告" width="120">
                        <template #default="scope">
                            <el-button link type="primary" size="small">查看</el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <el-button @click="$router.push('courseProTask')" style="margin-top: 3%; float: right;">返回</el-button>
            </div>
        </div>
    </div>
</template>
<script setup>
import { ref } from 'vue';
import { ArrowRight } from '@element-plus/icons-vue'
import { useRouter } from 'vue-router'

//页面跳转到发布
const router_useRouter = useRouter()

function toprocessTask() {
    router_useRouter.push({ path: 'processTask' })
}


const processTask = ref([
    {
        stuName: '学生A',
        stuId: '201919164111',
        subDate: '2023-4-19',
        className: 'RB软工互192',
    }
])

const taskDetial = ref({
    taskName: '过程任务一',
    taskType: '过程任务',
    startDate: '2023-4-16',
    endDate: '2023-4-20',
})
</script>